<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">

    <h:body>

        <ui:composition template="./../template.xhtml">

            <ui:define name="content">
                <p:growl id="msgs" showDetail="true" /> 
                <h:form>
                    <p:commandButton id="btnUsuarioCreate" update=":formCreate" oncomplete="dialogUsuarioCreate.show()" icon="ui-icon-plusthick" title="Cadastrar" value="Cadastrar Usuário"/>  
                </h:form> <br></br>
                <h:form id="formDataTable">  
                    <p:dataTable id="usuarios" var="usuario" value="#{usuarioBean.usuarios}" emptyMessage="Nenhum usuário cadastrado.">  

                        <p:column headerText="CPF" style="width:24%">  
                            <h:outputText value="#{usuario.cpf}" />  
                        </p:column>  

                        <p:column headerText="Login" style="width:24%">  
                            <h:outputText value="#{usuario.login}" />  
                        </p:column>  

                        <p:column headerText="Nome" style="width:24%">  
                            <h:outputText value="#{usuario.nome}" />  
                        </p:column>  

                        <p:column headerText="Cargo" style="width:24%">  
                            <h:outputText value="#{usuario.cargo}" />  
                        </p:column>  

                        <p:column headerText="Detalhes" style="width:4%">  
                            <p:commandButton id="selectButton" update=":formView" oncomplete="dialogUsuarioDetails.show()" icon="ui-icon-search" title="Detalhes">  
                                <f:setPropertyActionListener value="#{usuario}" target="#{usuarioBean.selectedUsuario}" />  
                            </p:commandButton>  
                        </p:column>  

                        <p:column headerText="Editar" style="width:4%">  
                            <p:commandButton id="btnUsuarioUpdate" update=":formUpdate" oncomplete="dialogUsuarioUpdate.show()" icon="ui-icon-pencil" title="Editar">  
                                <f:setPropertyActionListener value="#{usuario}" target="#{usuarioBean.selectedUsuario}" />  
                            </p:commandButton>  
                        </p:column>

                        <p:column headerText="Excluir" style="width:4%">  
                            <p:commandButton id="btnUsuarioDelete" update=":formDelete" oncomplete="dialogUsuarioDelete.show()" icon="ui-icon-trash" title="Excluir">  
                                <f:setPropertyActionListener value="#{usuario}" target="#{usuarioBean.selectedUsuario}" />  
                            </p:commandButton>  
                        </p:column> 

                    </p:dataTable>  
                </h:form>

                <h:form id="formCreate">
                    <p:dialog header="Cadastrar usuário " widgetVar="dialogUsuarioCreate" resizable="false" id="dlgUsuarioCreate"  
                              showEffect="fade" hideEffect="explode" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  

                            <h:outputText value="CPF:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.cpf}"/>  

                            <h:outputText value="Login:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.login}"/>  


                            <h:outputText value="Nome:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.nome}" size="35"/>  

                            <h:outputText value="Cargo:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.cargo}"/>  

                            <f:facet name="footer">
                                <p:separator/>
                                <p:commandButton id="btnCreateCancelar" oncomplete="dialogUsuarioCreate.hide()" icon="ui-icon-cancel" title="Cancelar" value="Cancelar"/>  
                                <p:commandButton id="btnCreateCadadastrar" update=":formDataTable, :msgs" oncomplete="dialogUsuarioCreate.hide()" actionListener="#{usuarioBean.btnCreateUsuario()}" icon="ui-icon-disk" title="Cadastrar" value="Cadastrar"/>  
                            </f:facet>

                        </h:panelGrid>  
                    </p:dialog>  
                </h:form> 

                <h:form id="formView">
                    <p:dialog header="Detalhes " widgetVar="dialogUsuarioDetails" resizable="false" id="dlgUsuarioDetails"  
                              showEffect="fade" hideEffect="explode" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  

                            <f:facet name="header">  
                                <p:graphicImage value="/resources/images/usuarios/#{usuarioBean.selectedUsuario.login}.jpg"/>  
                            </f:facet> 

                            <h:outputText value="CPF:" />  
                            <h:outputText value="#{usuarioBean.selectedUsuario.cpf}" style="font-weight:bold"/>  

                            <h:outputText value="Login:" />  
                            <h:outputText value="#{usuarioBean.selectedUsuario.login}" style="font-weight:bold"/>  


                            <h:outputText value="Nome:" />  
                            <h:outputText value="#{usuarioBean.selectedUsuario.nome}" style="font-weight:bold"/>  

                            <h:outputText value="Cargo:" />  
                            <h:outputText value="#{usuarioBean.selectedUsuario.cargo}" style="font-weight:bold"/>  
                        </h:panelGrid>  
                    </p:dialog>  
                </h:form> 

                <h:form id="formUpdate">
                    <p:dialog header="Alterar registro " widgetVar="dialogUsuarioUpdate" resizable="false" id="dlgUsuarioUpdate"  
                              showEffect="fade" hideEffect="explode" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  


                            <h:outputText value="CPF:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.cpf}"/>  

                            <h:outputText value="Login:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.login}"/>  


                            <h:outputText value="Nome:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.nome}" size="35"/>  

                            <h:outputText value="Cargo:" />  
                            <p:inputText value="#{usuarioBean.selectedUsuario.cargo}"/>  
                            
                            <f:facet name="footer"> 
                                <p:separator/>
                                <p:commandButton id="btnUpdateCancelar" oncomplete="dialogUsuarioUpdate.hide()" icon="ui-icon-cancel" title="Cancelar" value="Cancelar"/>  
                                <p:commandButton id="btnUpdateEditar" update=":formDataTable, :msgs" oncomplete="dialogUsuarioUpdate.hide()" icon="ui-icon-disk" title="Editar" value="Editar"/> 
                            </f:facet>
                            
                        </h:panelGrid>  
                    </p:dialog>  
                </h:form>  

                <h:form id="formDelete">
                    <p:confirmDialog id="confirmDialog" message="Excluir registro?" showEffect="fade" hideEffect="explode"
                                     header="Excluir usuário" severity="alert" widgetVar="dialogUsuarioDelete" >
                        <p:commandButton id="decline" value="Não" onclick="dialogUsuarioDelete.hide()" type="button" icon="ui-icon-cancel"/>
                        <p:commandButton id="confirm" value="Sim" update=":msgs" oncomplete="dialogUsuarioDelete.hide()"
                                         actionListener="#{usuarioBean.btnDeleteUsuario()}" icon="ui-icon-check"/>
                    </p:confirmDialog>

                </h:form>

            </ui:define>
        </ui:composition>
    </h:body>
</html>
